<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
</head>

<body>
    <!--<form action="server.jsp" method="post">-->
    <form action="server" method="post">
        用户名<input type="text" id="userName" name="userName" placeholder="请输入用户名" required/><span id="remain"></span> <br />
        密码<input type="text" id="password" name="password" placeholder="请输入密码" required/><br />
        <button type="submit">登录</button>
    </form>
</body>

<script type="text/javascript" src="js/jquery-1.8.0.min.js "></script>
<script type="text/javascript">
    $(function () {
        $("#userName").blur(function () {
            //获得value值
            var userName = $(this).val();
            //发送请求
            $.post("server","userName="+userName,function (result) {
                /*用户名有效性异步验证*/
                //$("#remain").html(result);

                /*根据用户名自动填充其它信息*/
                result = eval("("+result+")");//转换成可以处理的JSON，此时的res是JSON格式的对象
                $("#password").val(result.password);
            });
        });
    });
</script>

</html>